.tabs [data-state="active"] {
  border-color: orange;
}

input,
[data-bits-select-trigger],
textarea {
  background-color: rgba(0, 0, 0, 0.02) !important;
}
.dark input,
.dark [data-bits-select-trigger],
.dark textarea {
  background-color: rgba(0, 0, 0, 0.1) !important;
}

input[type="file"]::file-selector-button {
  display: none;
}
input[type="file"] {
  font-weight: 500;
  padding-top: 10px;
}

.image-upload .has-bg:hover .invisible {
  visibility: visible !important;
}

[aria-label="color picker"] input {
  color: rgba(0, 0, 0, 0.5) !important;
}
#start_date_time,
#end_date_time,
#newcomment_commented_at {
  width: 100%;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 14px;
  height: 40px;
  line-height: 20px;
  font-weight: 500;
  width: 100%;
}

#start_date_time::placeholder,
#end_date_time::placeholder {
  color: hsl(219, 14%, 47%);
}
.dark #start_date_time::placeholder,
.dark #end_date_time::placeholder {
  color: hsl(0, 0%, 40%);
}

.bg-hover {
  background-image: linear-gradient(to right, #d0f5be, #d0f5be);
  background-size: 25%;
  background-repeat: no-repeat;
  transition: background 0.3s;
}

.dark .bg-hover {
  background-image: linear-gradient(to right, #6f61c0, #6f61c0);
}
.bg-hover:has(div:first-child:hover),
.bg-hover.state-INVESTIGATING {
  background-size: 25%;
}
.bg-hover:has(div:nth-child(2):hover),
.bg-hover.state-IDENTIFIED {
  background-size: 50%;
}
.bg-hover:has(div:nth-child(3):hover),
.bg-hover.state-MONITORING {
  background-size: 75%;
}
.bg-hover:has(div:nth-child(4):hover),
.bg-hover.state-RESOLVED {
  background-size: 100%;
}

.no-scroll {
  overflow: hidden;
}
